<template>
  <g-popup
    class="add-feedback"
    v-bind="$attrs"
    title="新建咨询"
    v-on="$listeners"
    @closed="onClose"
  >
    <field-textarea v-model="title" placeholder="请输入咨询内容" />

    <fixed-bottom>
      <button-group @cancel="cancel" @confirm="confirm" />
    </fixed-bottom>
  </g-popup>
</template>

<script>
import GPopup from '@/components/GPopup.vue'
import FieldTextarea from '@/components/FieldTextarea.vue'
import ButtonGroup from '@/components/ButtonGroup.vue'
import { askQuestion } from '../api'
import Taro from '@tarojs/taro'
import FixedBottom from '@/components/FixedBottom'

export default {
  components: {
    GPopup,
    FixedBottom,
    ButtonGroup,
    FieldTextarea
  },
  data() {
    return {
      title: ''
    }
  },
  methods: {
    cancel() {
      this.$emit('input', false)
    },
    confirm() {
      if (!this.title) {
        Taro.showToast({ title: '请输入咨询内容', icon: 'none' })
        return
      }
      askQuestion({ title: this.title }).then(() => {
        Taro.showToast({
          title: '已保存',
          icon: 'success'
        })
        this.cancel()
        this.$emit('change')
      })
    },
    onClose() {
      this.title = ''
    }
  }
}
</script>

<style lang="less">
.add-feedback {
  .g-popup__body {
    padding: 0 40px;
  }
}
</style>
